Editing HTML Pages in Design View

The Design View pane of the HTML Designer provides a rich variety of tools for editing, formatting, and displaying HTML elements.

To add an HTML element to a Web page

• Click on the page, then double-click an element in the Toolbox. The item will be inserted as near as possible to the location of the insertion point on your page.

  — or —

• Select an item in the Toolbox, and then drag and drop on the design surface. The item will be created at the indicated position and will have the indicated size.

  Note   When you drop an external element, such as an image or file, onto a page, the HTML Designer creates a reference to it in the parent project.

To format an HTML element

Use any of these formatting methods:

• Select the desired item in Design View and choose options from the Format menu.
• Edit the element properties displayed in the Properties window.
• Edit the properties displayed on the Property Page for the element.

  Note   Formatting changes made in Design view modify the HTML markup for the page. These formatting changes can be further adjusted by editing their markup directly in HTML view.

To edit the properties of an HTML element

1. Select the desired item on the Design view editing pane.
2. Edit the property values displayed in the Properties window

   — or —

   Select Property Pages from the View menu, choose the appropriate category from its drop-down menu, and edit the property values displayed there.

To toggle markers for non-graphic HTML elements on and off in Design View

• Select Details from the View menu.

To make these markers display whenever you open a Web page in Design View

1. Select Options from the Tools menu.
2. Under the HTML Designer node, select Display.
3. Under Display Options, select Show Details for Non-Visible Elements.

   Tip   Turn on Details while editing in Design View. This will keep you from inadvertently deleting non-graphic elements (for example, <DIV>, <SPAN>, <FORM>, <SCRIPT>) from your page while editing.

To toggle borders on and off in Design View

• Select Visible Borders from the View menu.

To make these borders display whenever you open a Web page in Design View

1. Select Options from the Tools menu.
2. Under the HTML Designer node, select Display.
3. Under Display Options, select Show Borders for Borderless Elements.